import React, {Component} from 'react';
import { Route } from 'react-router';
import User from '../pages/home/user/user';
import Role from '../pages/home/authory/role/role';
import Auther from '../pages/home/authory/auth/auther';
import Goods from './home/goods/goods/goods';
import Classify from './home/goods/classify/classify';
import Data from './home/statistics/data';
import 'antd/dist/antd.css';
import './index.css';
import { Layout, Menu } from 'antd';
import { UserOutlined, LaptopOutlined, NotificationOutlined,BarChartOutlined,OrderedListOutlined } from '@ant-design/icons';
import { Link } from 'react-router-dom';
const { SubMenu } = Menu;
const { Header, Content, Sider } = Layout;

class Home extends Component {
    constructor(props){

        super();
    }
    render() {
        return (
                <Layout style={{height:"100%"}}>
                    <Header className="header">
                        <div className="logo" />
                        <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']}>
                            <Menu.Item key="1">首页</Menu.Item>
                            <Menu.Item key="2">订单</Menu.Item>
                            <Menu.Item key="3">用户</Menu.Item>
                            <Menu.Item key="4" className="btn">登出</Menu.Item>
                        </Menu>
                    </Header>
                    <Layout>
                        <Sider width={200} className="site-layout-background">
                            <Menu
                                mode="inline"
                                defaultSelectedKeys={['1']}
                                defaultOpenKeys={['sub1']}
                                style={{ height: '100%', borderRight: 0 }}>
                                <SubMenu key="sub1" icon={<UserOutlined />} title="用户管理">
                                    <Menu.Item key="1">
                                    <Link to={{ pathname: '/home/user/user',}}>
                                        用户列表
                                    </Link>
                                    </Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub2" icon={<LaptopOutlined />} title="权限管理">
                                    <Menu.Item key="5">
                                        <Link to={{ pathname: '/home/role',}}>
                                            角色列表
                                        </Link>
                                    </Menu.Item>
                                    <Menu.Item key="6">
                                        <Link to={{pathname:'/home/auther'}}>
                                            权限列表
                                        </Link>
                                    </Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub3" icon={<NotificationOutlined />} title="商品管理">
                                    <Menu.Item key="9">
                                        <Link to={{pathname:'/home/goods'}}>商品列表</Link>
                                    </Menu.Item>
                                    <Menu.Item key="10">分类参数</Menu.Item>
                                    <Menu.Item key="11">
                                        <Link to={{pathname:'/home/classify'}}>商品分类</Link>
                                    </Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub4" icon={<OrderedListOutlined />} title="订单管理">
                                    <Menu.Item key="12">订单列表</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub5" icon={<BarChartOutlined />} title="数据统计">
                                    <Menu.Item key="13">
                                        <Link to={{pathname:'/home/data'}}>数据报表</Link>
                                    </Menu.Item>
                                </SubMenu>
                            </Menu>
                        </Sider>
                        <Layout style={{ padding: '0 24px 24px' }}>
                            <Content className="site-layout-background" style={{padding: 24,margin: 0,minHeight: 280, }} >
                                <Route path='/home/user/user' component={User}></Route>
                                <Route path='/home/role' component={Role}></Route>
                                <Route path='/home/auther' component={Auther}></Route>
                                <Route path='/home/goods' component={Goods}></Route>
                                <Route path='/home/classify' component={Classify}></Route>
                                <Route path='/home/data' component={Data}></Route>
                            </Content>
                        </Layout>
                    </Layout>
                </Layout>
        );
    }
}
export default Home;